<template>
	<view class="page-container">
		<!-- 顶部标题和搜索表单 -->
		<view class="header-section">
			<view class="page-title">
				<text class="title-text">📊 历史记录</text>
			</view>
			
			<!-- 搜索表单 -->
			<view class="form-section">
				<view class="form-item input-item">
					<text class="form-label">条码号</text>
					<input class="form-input" v-model="form.barCode" placeholder="请输入条码号" :disabled="false" />
				</view>
				<view class="form-item input-item">
					<text class="form-label">姓名</text>
					<input class="form-input" v-model="form.userName" placeholder="请输入姓名" :disabled="false" />
				</view>
				<view class="form-item input-item">
					<text class="form-label">开始时间</text>
					<picker mode="date" :value="form.startTime" @change="onStartTimeChange" :disabled="false">
						<view class="form-input date-input picker-input">
							<text class="date-text" :class="{ 'placeholder': !form.startTime }">{{ form.startTime || '选择开始日期' }}</text>
							<text class="picker-arrow">📅</text>
						</view>
					</picker>
				</view>
				<view class="form-item input-item">
					<text class="form-label">结束时间</text>
					<picker mode="date" :value="form.endTime" @change="onEndTimeChange" :disabled="false">
						<view class="form-input date-input picker-input">
							<text class="date-text" :class="{ 'placeholder': !form.endTime }">{{ form.endTime || '选择结束日期' }}</text>
							<text class="picker-arrow">📅</text>
						</view>
					</picker>
				</view>
				<view class="button-group">
					<view class="form-item button-item">
						<button class="search-btn" @click="search">
							<text>🔍 搜索</text>
						</button>
					</view>
					<view class="form-item button-item">
						<button class="reset-btn" @click="resetForm">
							<text>🔄 重置</text>
						</button>
					</view>
				</view>
			</view>
		</view>

		<!-- 主体内容区域 -->
		<view class="main-content">
			<!-- 数据表格卡片 -->
			<view class="table-card">
				<view class="card-header">
					<text class="card-title">📋 测量记录列表</text>
					<view class="header-actions">
					<view class="record-stats">
						<text class="stats-text">共 {{ total }} 条记录</text>
							<text class="selected-stats" v-if="selectedItems.length > 0">已选择 {{ selectedItems.length }} 条</text>
						</view>
						<view class="action-buttons">
							<button 
								class="ai-upload-btn" 
								@click="smartUpload" 
								:disabled="aiUploading"
							>
								<text>{{ aiUploading ? '🤖 分析中...' : '🤖 智能上传' }}</text>
							</button>
							<button 
								class="batch-upload-btn" 
								@click="batchUpload" 
								:disabled="selectedItems.length === 0 || uploading"
								v-if="selectedItems.length > 0"
							>
								<text>{{ uploading ? '上传中...' : `📤 批量上传(${selectedItems.length})` }}</text>
							</button>
							<button 
								class="batch-delete-btn" 
								@click="batchDelete" 
								:disabled="selectedItems.length === 0 || deleting"
								v-if="selectedItems.length > 0"
							>
								<text>{{ deleting ? '删除中...' : `🗑️ 批量删除(${selectedItems.length})` }}</text>
							</button>
						</view>
					</view>
				</view>
				
				<!-- 血压颜色说明 -->
				<view class="color-legend">
					<view class="legend-title">
						<text class="legend-text">💡 血压状态颜色说明：</text>
					</view>
					<view class="legend-items">
						<view class="legend-item">
							<view class="legend-color high"></view>
							<text class="legend-label">血压偏高 (收缩压≥140 或 舒张压≥90)</text>
						</view>
						<view class="legend-item">
							<view class="legend-color normal"></view>
							<text class="legend-label">血压正常</text>
						</view>
						<view class="legend-item">
							<view class="legend-color low"></view>
							<text class="legend-label">血压偏低 (收缩压<90 或 舒张压<60)</text>
						</view>
					</view>
				</view>
				
				<scroll-view 
					class="table-container"
					:scroll-y="true"
					@scrolltolower="loadMore"
					@scroll="onScroll"
					:lower-threshold="50"
					:enable-back-to-top="true"
					:show-scrollbar="true"
				>
					<uni-table ref="table" :loading="loading" border stripe emptyText="暂无更多数据" class="custom-table">
						<uni-tr class="table-header">
							<uni-th width="50" align="center">
								<view class="checkbox-container">
									<checkbox-group @change="toggleSelectAll">
										<checkbox :checked="isAllSelected" color="#3b82f6" />
									</checkbox-group>
								</view>
							</uni-th>
							<uni-th width="100" align="center">条码号</uni-th>
							<uni-th width="80" align="center">姓名</uni-th>
							<uni-th width="85" align="center">收缩压</uni-th>
							<uni-th width="85" align="center">舒张压</uni-th>
							<uni-th width="70" align="center">心率</uni-th>
							<uni-th width="90" align="center">血压结果</uni-th>
							<uni-th width="120" align="center">测量时间</uni-th>
							<uni-th width="100" align="center">设备名称</uni-th>
							<uni-th width="110" align="center">操作</uni-th>
						</uni-tr>
						<uni-tr v-for="(item, index) in tableData" :key="item.id || index" class="table-row">
							<uni-td align="center">
								<view class="checkbox-container">
									<checkbox-group @change="toggleSelectItem(item)">
										<checkbox :checked="isItemSelected(item)" color="#3b82f6" :disabled="item.isUpload !== 0" />
									</checkbox-group>
								</view>
							</uni-td>
							<uni-td align="center">
								<text class="cell-text">{{ item.barCode || '-' }}</text>
							</uni-td>
							<uni-td align="center">
								<text class="cell-text">{{ item.userName || '-' }}</text>
							</uni-td>
							<uni-td align="center">
								<view class="pressure-cell">
									<text class="pressure-value" :class="getBloodPressureClass(item)">{{ item.systolicPressure || '-' }}</text>
									<text class="pressure-unit">mmHg</text>
								</view>
							</uni-td>
							<uni-td align="center">
								<view class="pressure-cell">
									<text class="pressure-value" :class="getBloodPressureClass(item)">{{ item.diastolicPressure || '-' }}</text>
									<text class="pressure-unit">mmHg</text>
								</view>
							</uni-td>
							<uni-td align="center">
								<view class="pulse-cell">
									<text class="pulse-value">{{ item.pulse || '-' }}</text>
									<text class="pulse-unit">bpm</text>
								</view>
							</uni-td>
							<uni-td align="center">
								<view class="blood-pressure-result">
									<text class="result-text" :class="getBloodPressureClass(item)">{{ getBloodPressureText(item) }}</text>
								</view>
							</uni-td>
							<uni-td align="center">
								<text class="time-text">{{ item.measurementTime || '-' }}</text>
							</uni-td>
							<uni-td align="center">
								<text class="device-text">{{ item.deviceName || '默认设备' }}</text>
							</uni-td>
							<uni-td align="center">
								<view class="action-cell">
									<view v-if="item.isUpload === 1" class="upload-status success">
										<text>✅ 已上传</text>
									</view>
									<view v-else-if="item.isUpload === 2" class="upload-status failed">
										<text>⚠️ 上传失败/待上传</text>
									</view>
									<button v-else class="upload-btn" @click="upload(item)" :disabled="false">
										<text>📤 上传</text>
									</button>
								</view>
							</uni-td>
						</uni-tr>
					</uni-table>
				</scroll-view>
				
				<!-- 加载更多提示 -->
				<view class="load-more-section" v-if="tableData.length > 0">
					<view v-if="loadingMore" class="loading-tip">
						<text class="loading-text">⏳ 正在加载更多...</text>
					</view>
					<view v-else-if="!hasMore" class="no-more-tip">
						<text class="no-more-text">✅ 已加载全部数据</text>
					</view>
					<view v-else class="pull-tip">
						<text class="pull-text">👆 滑动表格查看更多数据</text>
					</view>
				</view>
			</view>
		</view>

		<!-- AI智能上传弹窗 -->
		<view class="ai-modal-overlay" v-if="showAiModal" @click="closeAiModal">
			<view class="ai-modal-container" @click.stop>
				<view class="ai-modal-header">
					<text class="ai-modal-title">🤖 AI智能上传结果</text>
					<text class="close-btn" @click="closeAiModal">✕</text>
				</view>
				
				<view class="ai-modal-content">
					<view class="ai-result-info">
						<text class="result-count">共检测到 {{ aiResults.length }} 条待上传记录</text>
					</view>
					
					<scroll-view class="ai-results-list" scroll-y="true">
						<view class="ai-result-item" v-for="(item, index) in aiResults" :key="item.id">
							<view class="result-header">
								<text class="result-index">{{ index + 1 }}.</text>
								<text class="result-name">{{ item.userName || '未知' }}</text>
								<text class="result-barcode">{{ item.barCode || '无条码' }}</text>
							</view>
							<view class="result-data">
								<view class="data-group">
									<text class="data-label">血压：</text>
									<text class="data-value">{{ item.systolicPressure }}/{{ item.diastolicPressure }} mmHg</text>
								</view>
								<view class="data-group">
									<text class="data-label">心率：</text>
									<text class="data-value">{{ item.pulse }} bpm</text>
								</view>
								<view class="data-group">
									<text class="data-label">性别：</text>
									<text class="data-value">{{ item.gender || '未知' }}</text>
								</view>
							</view>
							<view class="result-time">
								<text class="time-text">{{ item.measurementTime }}</text>
							</view>
						</view>
					</scroll-view>
				</view>
				
				<view class="ai-modal-footer">
					<button class="cancel-btn" @click="closeAiModal">取消</button>
					<button class="confirm-btn" @click="confirmAiUpload" :disabled="confirmUploading">
						<text>{{ confirmUploading ? '上传中...' : '确定上传' }}</text>
					</button>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		queryListPage,
		batchUploadResults,
		getAiSubmitResult,
		aiSubmit,
		deleteBatchResults,
		getUserInfoByBarCode
	} from "../../api/business.js"
	
	export default {
		data() {
			return {
				historyData: [],
				searchVal: '',
				tableData: [],
				pageSize: 10  ,
				pageCurrent: 1,
				total: 0,
				loading: false,
				loadingMore: false, // 加载更多的状态
				hasMore: true, // 是否还有更多数据
				loadMoreTimer: null, // 加载更多的防抖定时器
				form: {
					barCode: '',
					userName: '',
					startTime: '',
					endTime: ''
				},
				selectedItems: [], // 选中的记录
				uploading: false, // 批量上传时的上传状态
				deleting: false, // 批量删除时的删除状态
				// AI智能上传相关
				showAiModal: false, // 是否显示AI上传弹窗
				aiResults: [], // AI分析结果
				aiUploading: false, // 智能上传分析状态
				confirmUploading: false // 确认上传状态
			}
		},
		computed: {
			// 判断是否全选
			isAllSelected() {
				const unUploadedItems = this.tableData.filter(item => item.isUpload === 0);
				return unUploadedItems.length > 0 && unUploadedItems.every(item => item.isSelected);
			}
		},
		onLoad(options) {
			this.selectedIndexs = []
			
			// 时间测试 - 验证北京时间获取是否正确
			const now = new Date();
			console.log('=== 时间验证测试 ===');
			console.log('当前时间对象:', now);
			console.log('当前时间字符串:', now.toString());
			console.log('当前年份:', now.getFullYear());
			console.log('当前月份:', now.getMonth() + 1);
			console.log('当前日期:', now.getDate());
			console.log('当前小时:', now.getHours());
			console.log('时区偏移（分钟）:', now.getTimezoneOffset());
			console.log('==================');
			
			// 设置默认时间范围（北京时间）
			this.setDefaultTimeRange();
			
			// 测试时间格式化功能
			console.log('测试时间格式化:', this.formatTimeRange('2024-01-15', '2024-01-16'));
			
			// 上传状态说明:
			// isUpload = 0: 显示上传按钮（可点击上传，可选中进行批量上传）
			// isUpload = 1: 显示已上传状态（不可选中，不可上传）
			// isUpload = 2: 显示上传失败状态（不可选中，不可上传）
			
			// 如果从measure页面传递了条码号参数，则填充到搜索表单中
			if (options && options.barCode) {
				this.form.barCode = decodeURIComponent(options.barCode);
			}
			
			// 使用form对象进行搜索，确保时间范围生效
			this.getData(1, this.form, false);
			
			this.loadHistory()
		},
		onUnload() {
			// 清理定时器
			if (this.loadMoreTimer) {
				clearTimeout(this.loadMoreTimer);
				this.loadMoreTimer = null;
			}
		},
		methods: {
			// 上传数据
			async upload(item) {
				try {
					// 检查记录是否有有效的ID
					if (!item.id) {
						throw new Error('记录没有有效的ID');
					}
					
					// 上传前先验证用户信息
					const shouldContinueUpload = await this.validateUserBeforeUpload(item.barCode);
					if (!shouldContinueUpload) {
						return;
					}
					
					uni.showLoading({ title: '上传中...' })
					
					// 使用批量上传接口，将单个ID包装成数组
					const res = await batchUploadResults([item.id]);
					
					// 更新本地状态
					item.isUpload = 1
					
					uni.hideLoading()
					uni.showToast({
						title: '✅ 上传成功',
						icon: 'success',
						duration: 2000
					})
					setTimeout(() => {
						this.search();
					}, 500);
				} catch (error) {
					console.log(error)
				
					uni.hideLoading()
					uni.showToast({
						title: '❌ ' + (error.data?.message || '上传失败'),
						icon: 'none',
						duration: 3000
					})
					console.error('上传失败:', error)
				}
			},

			// 批量上传
			async batchUpload() {
				if (this.selectedItems.length === 0) {
					uni.showToast({
						title: '请选择要上传的记录',
						icon: 'none'
					})
					return
				}

				// 批量验证用户信息
				const shouldContinueUpload = await this.validateBatchUsersBeforeUpload(this.selectedItems);
				if (!shouldContinueUpload) {
					return;
				}

				this.uploading = true
				uni.showLoading({ title: '批量上传中...' })

				try {
					// 提取选中记录的ID
					const ids = this.selectedItems.map(item => item.id).filter(id => id !== undefined);
					
					if (ids.length === 0) {
						throw new Error('选中的记录没有有效的ID');
					}

					// 调用批量上传API
					const res = await batchUploadResults(ids);
					
					uni.hideLoading()
					uni.showToast({
						title: `✅ 成功上传`,
						icon: 'success',
						duration: 3000
					})
					setTimeout(() => {
						this.search();
					}, 500);
					
					// 更新本地状态：将已选中的记录标记为已上传
					this.selectedItems.forEach(item => {
						item.isUpload = 1;
						item.isSelected = false;
					});
					
					this.selectedItems = [] // 上传完成后清空选中
					
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '❌ ' + (error.data?.message || '批量上传失败'),
						icon: 'none',
						duration: 3000
					})
					console.error('批量上传失败:', error)
				} finally {
					this.uploading = false
				}
			},

			// 加载更多数据
			loadMore() {
				console.log('loadMore触发，当前状态:', {
					loadingMore: this.loadingMore,
					hasMore: this.hasMore,
					currentPage: this.pageCurrent,
					totalRecords: this.total,
					currentRecords: this.tableData.length
				});

				if (this.loadingMore || !this.hasMore) {
					console.log('跳过加载更多：', this.loadingMore ? '正在加载' : '没有更多数据');
					return;
				}

				// 防抖处理，避免快速滚动时重复触发
				if (this.loadMoreTimer) {
					clearTimeout(this.loadMoreTimer);
				}

				this.loadMoreTimer = setTimeout(() => {
					console.log('触发加载更多，当前页:', this.pageCurrent);
					this.getData(this.pageCurrent + 1, this.form, true);
				}, 300);
			},

			// 滚动事件监听
			onScroll(e) {
				console.log('滚动事件触发:', {
					scrollTop: e.detail.scrollTop,
					scrollHeight: e.detail.scrollHeight,
					scrollLeft: e.detail.scrollLeft,
					deltaY: e.detail.deltaY
				});
			},

			// 搜索
			search() {
				this.tableData = []; // 清空现有数据
				this.selectedItems = []; // 清空选中状态
				this.pageCurrent = 1;
				this.hasMore = true;
				this.getData(1, this.form, false);
			},

			// 重置表单
			resetForm() {
				this.form = {
					barCode: '',
					userName: '',
					startTime: '',
					endTime: ''
				}
				
				// 设置默认时间范围
				this.setDefaultTimeRange();
				
				this.tableData = []; // 清空现有数据
				this.selectedItems = []; // 清空选中状态
				this.pageCurrent = 1;
				this.hasMore = true;
				this.getData(1, {}, false);
			},

			// 获取数据
			async getData(pageCurrent, searchForm = {}, isLoadMore = false) {
				if (isLoadMore) {
					this.loadingMore = true;
				} else {
					this.loading = true;
				}
				
				this.pageCurrent = pageCurrent;

				try {
					// 处理时间范围
					let timeRange;
					if (searchForm.startTime || searchForm.endTime) {
						console.log('使用用户自定义时间范围:', { startTime: searchForm.startTime, endTime: searchForm.endTime });
						timeRange = this.formatTimeRange(searchForm.startTime, searchForm.endTime);
					} else {
						console.log('使用默认当天时间范围');
						timeRange = this.getTodayTimeRange();
					}
					
					console.log('最终使用的时间范围:', timeRange);
					
					const params = {
						pageNum: pageCurrent,
						pageSize: this.pageSize,
						startMeasurementTime: timeRange.startTime,
						endMeasurementTime: timeRange.endTime,
						...searchForm
					}
					
					// 移除时间参数，避免重复
					delete params.startTime;
					delete params.endTime;
					
					console.log('请求参数:', params)
					const res = await queryListPage(params)
					console.log('接口响应成功，开始处理数据...')
					
					if (res.data && res.data.success === true && res.data.content) {
						console.log('条件检查通过，开始处理数据...')
						const newData = res.data.content.list || [];
						
						// 为每条记录添加选中状态
						newData.forEach(item => {
							item.isSelected = false;
						});
						
						this.total = res.data.content.total || 0;
						
						if (isLoadMore) {
							// 加载更多：追加数据
							this.tableData = [...this.tableData, ...newData];
							console.log('追加数据完成，新增记录数:', newData.length);
						} else {
							// 首次加载或搜索：替换数据
							this.tableData = newData;
							console.log('数据替换完成，记录数:', this.tableData.length);
						}
						
						// 判断是否还有更多数据
						this.hasMore = this.tableData.length < this.total;
						
						console.log('当前状态:', {
							currentPage: this.pageCurrent,
							currentCount: this.tableData.length,
							total: this.total,
							hasMore: this.hasMore,
							isLoadMore: isLoadMore
						});
						
						const message = isLoadMore ? 
							`📋 加载了${newData.length}条新记录` : 
							`📋 成功获取${this.tableData.length}条记录`;
						
						uni.showToast({
							title: message,
							icon: 'success',
							duration: 2000
						});
						
					} else {
						console.warn('响应格式不正确或success为false')
						console.warn('检查失败的详细信息:', {
							hasData: !!res.data,
							success: res.data?.success,
							successType: typeof res.data?.success,
							hasContent: !!res.data?.content
						})
						throw new Error(res.data?.message || '数据格式错误')
					}
				} catch (error) {
					console.error('获取数据失败:', error)
					uni.showToast({
						title: '❌ ' + (error.data?.message || '获取数据失败'),
						icon: 'none',
						duration: 3000
					})
				} finally {
					this.loading = false;
					this.loadingMore = false;
				}
			},

			// 从本地存储加载历史数据
			loadHistory() {
				const history = uni.getStorageSync('bloodPressureHistory')
				if (history) {
					this.historyData = history
				}
			},



			// 格式化日期
			formatDate(timestamp) {
				const date = new Date(timestamp)
				return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`
			},

			// 格式化时间
			formatTime(timestamp) {
				const date = new Date(timestamp)
				return `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`
			},

			// 获取当天时间范围（北京时间）
			getTodayTimeRange() {
				// 获取当前北京时间
				const now = new Date();
				console.log('当前本地时间:', now);
				console.log('当前本地时间字符串:', now.toString());
				
				// 当天开始时间 (00:00:00) - 使用本地时间
				const startTime = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0, 0);
				// 当天结束时间 (23:59:59) - 使用本地时间
				const endTime = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59, 999);
				
				console.log('计算的开始时间:', startTime);
				console.log('计算的结束时间:', endTime);
				
				// 格式化为字符串 - 使用本地时间格式化
				const formatDateTime = (date) => {
					const year = date.getFullYear();
					const month = String(date.getMonth() + 1).padStart(2, '0');
					const day = String(date.getDate()).padStart(2, '0');
					const hours = String(date.getHours()).padStart(2, '0');
					const minutes = String(date.getMinutes()).padStart(2, '0');
					const seconds = String(date.getSeconds()).padStart(2, '0');
					
					return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
				};
				
				const result = {
					startTime: formatDateTime(startTime),
					endTime: formatDateTime(endTime)
				};
				
				console.log('当天时间范围（北京时间）:', result);
				return result;
			},

			// 格式化用户自定义时间范围
			formatTimeRange(startTime, endTime) {
				console.log('formatTimeRange输入:', { startTime, endTime });
				
				let start, end;
				
				if (startTime) {
					start = new Date(startTime + 'T00:00:00'); // 确保正确解析日期，使用本地时间
					console.log('解析开始时间（本地）:', start);
					console.log('解析开始时间字符串:', start.toString());
				}
				
				if (endTime) {
					end = new Date(endTime + 'T23:59:59'); // 确保正确解析日期，使用本地时间
					console.log('解析结束时间（本地）:', end);
					console.log('解析结束时间字符串:', end.toString());
				}
				
				// 如果只提供了一个时间，另一个使用默认值
				if (!start && end) {
					start = new Date(end);
					start.setHours(0, 0, 0, 0);
					console.log('补充开始时间:', start);
				}
				if (!end && start) {
					end = new Date(start);
					end.setHours(23, 59, 59, 999);
					console.log('补充结束时间:', end);
				}
				
				// 确保开始时间早于结束时间
				if (start && end && start > end) {
					console.log('时间顺序错误，进行交换');
					const temp = new Date(start);
					start = new Date(end.toDateString() + ' 00:00:00');
					end = new Date(temp.toDateString() + ' 23:59:59');
					console.log('交换后:', { start, end });
				}
				
				// 格式化为 YYYY-MM-DD HH:MM:SS - 使用本地时间
				const formatDateTime = (date) => {
					const year = date.getFullYear();
					const month = String(date.getMonth() + 1).padStart(2, '0');
					const day = String(date.getDate()).padStart(2, '0');
					const hours = String(date.getHours()).padStart(2, '0');
					const minutes = String(date.getMinutes()).padStart(2, '0');
					const seconds = String(date.getSeconds()).padStart(2, '0');
					
					return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
				};
				
				const result = {
					startTime: start ? formatDateTime(start) : '',
					endTime: end ? formatDateTime(end) : ''
				};
				
				console.log('用户自定义时间范围输出（本地时间）:', result);
				return result;
			},

			// 切换全选
			toggleSelectAll(e) {
				const isChecked = e.detail.value.length > 0;
				const unUploadedItems = this.tableData.filter(item => item.isUpload === 0);
				
				unUploadedItems.forEach(item => {
					item.isSelected = isChecked;
				});
				
				this.selectedItems = isChecked ? unUploadedItems.slice() : [];
			},

			// 切换单选
			toggleSelectItem(item) {
				if (item.isUpload !== 0) return; // 只有未上传的记录能被选择
				
				item.isSelected = !item.isSelected;
				if (item.isSelected) {
					// 添加到选中数组，避免重复
					if (!this.selectedItems.find(selectedItem => selectedItem.id === item.id)) {
						this.selectedItems.push(item);
					}
				} else {
					this.selectedItems = this.selectedItems.filter(selectedItem => selectedItem.id !== item.id);
				}
			},

			// 判断是否选中
			isItemSelected(item) {
				return item.isSelected;
			},

			// 设置默认时间范围（北京时间）
			setDefaultTimeRange() {
				const now = new Date();
				console.log('当前本地时间:', now);
				console.log('当前本地时间字符串:', now.toString());
				
				// 使用本地时间获取年月日
				const year = now.getFullYear();
				const month = now.getMonth();
				const date = now.getDate();
				
				console.log('本地日期信息:', { year, month: month + 1, date });
				
				// 设置开始时间为今天，格式为YYYY-MM-DD - 使用本地时间
				const today = new Date(year, month, date);
				
				// 手动格式化日期，避免使用toISOString()
				const formatDate = (date) => {
					const y = date.getFullYear();
					const m = String(date.getMonth() + 1).padStart(2, '0');
					const d = String(date.getDate()).padStart(2, '0');
					return `${y}-${m}-${d}`;
				};
				
				this.form.startTime = formatDate(today);
				this.form.endTime = formatDate(today);
				
				console.log('设置默认时间范围（北京时间）:', {
					startTime: this.form.startTime,
					endTime: this.form.endTime,
					todayLocal: today.toString()
				});
			},

			// 开始时间选择器变化
			onStartTimeChange(e) {
				this.form.startTime = e.detail.value;
				console.log('开始时间已选择:', e.detail.value);
			},

			// 结束时间选择器变化
			onEndTimeChange(e) {
				this.form.endTime = e.detail.value;
				console.log('结束时间已选择:', e.detail.value);
			},

			// 格式化显示日期
			formatDisplayDate(dateStr) {
				if (!dateStr) return '';
				
				const date = new Date(dateStr);
				const year = date.getFullYear();
				const month = String(date.getMonth() + 1).padStart(2, '0');
				const day = String(date.getDate()).padStart(2, '0');
				
				return `${year}-${month}-${day}`;
			},

			// AI智能上传
			async smartUpload() {
				this.aiUploading = true;
				
				try {
					uni.showLoading({
						title: 'AI分析中...',
						mask: true
					});

					console.log('开始请求AI智能上传结果...');
					const res = await getAiSubmitResult();
					console.log('AI智能上传结果响应:', res);

					if (res.data && res.data.success) {
						this.aiResults = res.data.content;
						
						if (this.aiResults!=null && this.aiResults.length > 0) {
							// 有数据，显示弹窗
							this.showAiModal = true;
							uni.hideLoading();
							console.log(`AI检测到 ${this.aiResults.length} 条待上传记录`);
						} else {
							// 没有数据
							uni.hideLoading();
							uni.showToast({
								title: '🤖 AI未检测到待上传记录',
								icon: 'none',
								duration: 3000
							});
						}
					} else {
						throw new Error(res.data?.message || 'AI分析失败');
					}
				} catch (error) {
					uni.hideLoading();
					console.error('AI智能上传失败:', error);
					
					// 获取错误信息
					let errorMessage = 'AI智能分析失败';
					if (error.data && error.data.message) {
						errorMessage = error.data.message;
					} else if (error.message) {
						errorMessage = error.message;
					} else if (error.errMsg) {
						if (error.errMsg.includes('timeout')) {
							errorMessage = '网络请求超时，请稍后重试';
						} else if (error.errMsg.includes('fail')) {
							errorMessage = '网络连接失败，请检查网络';
						} else {
							errorMessage = '请求失败：' + error.errMsg;
						}
					}
					
					// 使用 modal 确保在最上层显示错误信息
					uni.showModal({
						title: '🤖 智能分析失败',
						content: errorMessage + '\n\n请检查网络连接或联系技术支持',
						showCancel: true,
						cancelText: '关闭',
						confirmText: '重试分析',
						success: (modalRes) => {
							if (modalRes.confirm) {
								// 用户选择重试
								setTimeout(() => {
									this.smartUpload();
								}, 300);
							}
						}
					});
				} finally {
					this.aiUploading = false;
				}
			},

			// 关闭AI弹窗
			closeAiModal() {
				this.showAiModal = false;
				this.aiResults = [];
			},

			// 确认AI上传
			async confirmAiUpload() {
				// AI上传前先验证用户信息
				const shouldContinueUpload = await this.validateAiUsersBeforeUpload(this.aiResults);
				if (!shouldContinueUpload) {
					return;
				}

				this.confirmUploading = true;
				
				try {
					uni.showLoading({
						title: '正在上传...',
						mask: true
					});

					console.log('开始确认AI上传...');
					const res = await aiSubmit();
					console.log('AI确认上传响应:', res);

					if (res.data && res.data.success) {
						uni.hideLoading();
						
						// 先关闭弹窗，确保toast能在最上层显示
						this.closeAiModal();
						
						// 延迟显示成功提示，确保弹窗关闭动画完成
						setTimeout(() => {
							uni.showToast({
								title: `✅ 成功上传`,
								icon: 'success',
								duration: 3000
							});
						}, 300);

						// 刷新页面数据
						setTimeout(() => {
							this.search();
						}, 1500);
					} else {
						throw new Error(res.data?.message || '上传失败');
					}
				} catch (error) {
					uni.hideLoading();
					console.error('AI确认上传失败:', error);
					
					// 获取错误信息
					let errorMessage = '数据上传失败';
					if (error.data && error.data.message) {
						errorMessage = error.data.message;
					} else if (error.message) {
						errorMessage = error.message;
					} else if (error.errMsg) {
						if (error.errMsg.includes('timeout')) {
							errorMessage = '上传超时，请稍后重试';
						} else if (error.errMsg.includes('fail')) {
							errorMessage = '网络连接失败，请检查网络';
						} else {
							errorMessage = '上传失败：' + error.errMsg;
						}
					}
					
					// 使用 modal 确保在最上层显示错误信息
					uni.showModal({
						title: '❌ 上传失败',
						content: errorMessage ,
						showCancel: true,
						cancelText: '关闭',
						confirmText: '重试上传',
						success: (modalRes) => {
							if (modalRes.confirm) {
								// 用户选择重试
								setTimeout(() => {
									this.confirmAiUpload();
								}, 300);
							}
						}
					});
				} finally {
					this.confirmUploading = false;
				}
			},

			// AI智能上传用户验证（用于AI确认上传）
			async validateAiUsersBeforeUpload(aiResults) {
				if (!aiResults || aiResults.length === 0) {
					return true;
				}

				// 提取所有条码号，去重
				const barCodes = [...new Set(aiResults.map(item => item.barCode).filter(code => code && code.trim()))];
				
				if (barCodes.length === 0) {
					console.log('AI结果中没有有效的条码号，跳过验证');
					return true;
				}

				try {
					console.log('AI上传前批量验证用户信息，条码号列表:', barCodes);
					uni.showLoading({
						title: 'AI验证用户信息...',
						mask: true
					});

					// 并发查询所有用户信息
					const validationPromises = barCodes.map(async (barCode) => {
						try {
							const res = await getUserInfoByBarCode(barCode.trim());
							return {
								barCode: barCode,
								exists: !!(res.data && res.data.content),
								error: null
							};
						} catch (error) {
							return {
								barCode: barCode,
								exists: false,
								error: error.data?.message || error.message || '查询失败'
							};
						}
					});

					const validationResults = await Promise.all(validationPromises);
					uni.hideLoading();

					// 找出不存在的用户
					const notFoundUsers = validationResults.filter(result => !result.exists);
					
					console.log('AI上传批量验证结果:', {
						total: validationResults.length,
						found: validationResults.length - notFoundUsers.length,
						notFound: notFoundUsers.length,
						notFoundList: notFoundUsers
					});

					// 如果所有用户都存在，直接继续上传
					if (notFoundUsers.length === 0) {
						console.log('AI上传：所有用户信息验证通过，继续上传');
						return true;
					}

					// 有用户不存在，询问是否继续上传
					const notFoundBarCodes = notFoundUsers.map(user => user.barCode).join('、');
					const content = `以下患者信息不存在：\n${notFoundBarCodes}\n\n是否继续AI智能上传？`;

					return new Promise((resolve) => {
						uni.showModal({
							title: 'AI验证结果',
							content: content,
							cancelText: '否',
							confirmText: '是',
							success: (modalRes) => {
								if (modalRes.confirm) {
									console.log('用户选择继续AI智能上传');
									resolve(true);
								} else {
									console.log('用户选择不进行AI智能上传');
									resolve(false);
								}
							},
							fail: () => {
								console.log('弹窗失败，默认不上传');
								resolve(false);
							}
						});
					});

				} catch (error) {
					uni.hideLoading();
					console.error('AI上传批量验证用户信息失败:', error);
					
					// 批量验证失败，询问用户是否继续上传
					return new Promise((resolve) => {
						let errorMessage = 'AI验证用户信息失败';
						if (error.message) {
							errorMessage = error.message;
						}

						uni.showModal({
							title: 'AI验证失败',
							content: `${errorMessage}，是否继续AI智能上传？`,
							cancelText: '否',
							confirmText: '是',
							success: (modalRes) => {
								if (modalRes.confirm) {
									console.log('用户选择继续AI智能上传');
									resolve(true);
								} else {
									console.log('用户选择不进行AI智能上传');
									resolve(false);
								}
							},
							fail: () => {
								console.log('弹窗失败，默认不上传');
								resolve(false);
							}
						});
					});
				}
			},

			// 获取血压状态的CSS类名（参考measure页面的逻辑）
			getBloodPressureClass(item) {
				if (!item || !item.systolicPressure || !item.diastolicPressure) {
					return 'normal'; // 默认正常状态
				}
				
				const systolic = Number(item.systolicPressure);
				const diastolic = Number(item.diastolicPressure);
				
				// 收缩压大于等于140或舒张压大于等于90则血压高
				if (systolic >= 140 || diastolic >= 90) {
					return 'high';
				}
				
				// 收缩压小于90或舒张压小于60则血压低
				if (systolic < 90 || diastolic < 60) {
					return 'low';
				}
				
				// 其他情况为正常
				return 'normal';
			},

			// 获取血压结果文本
			getBloodPressureText(item) {
				if (!item || !item.systolicPressure || !item.diastolicPressure) {
					return '-'; // 无数据时显示横线
				}
				
				const systolic = Number(item.systolicPressure);
				const diastolic = Number(item.diastolicPressure);
				
				// 收缩压大于等于140或舒张压大于等于90则血压高
				if (systolic >= 140 || diastolic >= 90) {
					return '血压偏高';
				}
				
				// 收缩压小于90或舒张压小于60则血压低
				if (systolic < 90 || diastolic < 60) {
					return '血压偏低';
				}
				
				// 其他情况为正常
				return '血压正常';
			},

			// 单个用户验证（用于单个上传）
			async validateUserBeforeUpload(barCode) {
				if (!barCode || !barCode.trim()) {
					console.log('条码号为空，跳过用户验证');
					return true;
				}

				try {
					console.log('上传前验证用户信息，条码号:', barCode);
					uni.showLoading({
						title: '验证用户信息...',
						mask: true
					});

					const res = await getUserInfoByBarCode(barCode.trim());
					console.log('用户验证响应:', res);

					uni.hideLoading();

					// 如果查询成功，直接继续上传
					if (res.data && res.data.content) {
						console.log('用户信息验证通过，继续上传');
						return true;
					} else {
						// 查询失败，询问用户是否继续上传
						console.log('用户信息不存在，询问是否继续上传');
						return new Promise((resolve) => {
							uni.showModal({
								title: '提示',
								content: `患者信息不存在（条码号：${barCode}），是否继续上传？`,
								cancelText: '否',
								confirmText: '是',
								success: (modalRes) => {
									if (modalRes.confirm) {
										console.log('用户选择继续上传');
										resolve(true);
									} else {
										console.log('用户选择不上传');
										resolve(false);
									}
								},
								fail: () => {
									console.log('弹窗失败，默认不上传');
									resolve(false);
								}
							});
						});
					}
				} catch (error) {
					uni.hideLoading();
					console.error('验证用户信息失败:', error);
					
					// 验证失败，询问用户是否继续上传
					return new Promise((resolve) => {
						let errorMessage = '患者信息不存在';
						if (error.data && error.data.message) {
							errorMessage = error.data.message;
						} else if (error.message) {
							errorMessage = error.message;
						}

						uni.showModal({
							title: '提示',
							content: `${errorMessage}（条码号：${barCode}），是否继续上传？`,
							cancelText: '否',
							confirmText: '是',
							success: (modalRes) => {
								if (modalRes.confirm) {
									console.log('用户选择继续上传');
									resolve(true);
								} else {
									console.log('用户选择不上传');
									resolve(false);
								}
							},
							fail: () => {
								console.log('弹窗失败，默认不上传');
								resolve(false);
							}
						});
					});
				}
			},

			// 批量用户验证（用于批量上传）
			async validateBatchUsersBeforeUpload(selectedItems) {
				if (!selectedItems || selectedItems.length === 0) {
					return true;
				}

				// 提取所有条码号，去重
				const barCodes = [...new Set(selectedItems.map(item => item.barCode).filter(code => code && code.trim()))];
				
				if (barCodes.length === 0) {
					console.log('没有有效的条码号，跳过批量验证');
					return true;
				}

				try {
					console.log('批量验证用户信息，条码号列表:', barCodes);
					uni.showLoading({
						title: '批量验证用户信息...',
						mask: true
					});

					// 并发查询所有用户信息
					const validationPromises = barCodes.map(async (barCode) => {
						try {
							const res = await getUserInfoByBarCode(barCode.trim());
							return {
								barCode: barCode,
								exists: !!(res.data && res.data.content),
								error: null
							};
						} catch (error) {
							return {
								barCode: barCode,
								exists: false,
								error: error.data?.message || error.message || '查询失败'
							};
						}
					});

					const validationResults = await Promise.all(validationPromises);
					uni.hideLoading();

					// 找出不存在的用户
					const notFoundUsers = validationResults.filter(result => !result.exists);
					
					console.log('批量验证结果:', {
						total: validationResults.length,
						found: validationResults.length - notFoundUsers.length,
						notFound: notFoundUsers.length,
						notFoundList: notFoundUsers
					});

					// 如果所有用户都存在，直接继续上传
					if (notFoundUsers.length === 0) {
						console.log('所有用户信息验证通过，继续批量上传');
						return true;
					}

					// 有用户不存在，询问是否继续上传
					const notFoundBarCodes = notFoundUsers.map(user => user.barCode).join('、');
					const content = `以下患者信息不存在：\n${notFoundBarCodes}\n\n是否继续批量上传？`;

					return new Promise((resolve) => {
						uni.showModal({
							title: '批量验证结果',
							content: content,
							cancelText: '否',
							confirmText: '是',
							success: (modalRes) => {
								if (modalRes.confirm) {
									console.log('用户选择继续批量上传');
									resolve(true);
								} else {
									console.log('用户选择不进行批量上传');
									resolve(false);
								}
							},
							fail: () => {
								console.log('弹窗失败，默认不上传');
								resolve(false);
							}
						});
					});

				} catch (error) {
					uni.hideLoading();
					console.error('批量验证用户信息失败:', error);
					
					// 批量验证失败，询问用户是否继续上传
					return new Promise((resolve) => {
						let errorMessage = '批量验证用户信息失败';
						if (error.message) {
							errorMessage = error.message;
						}

						uni.showModal({
							title: '验证失败',
							content: `${errorMessage}，是否继续批量上传？`,
							cancelText: '否',
							confirmText: '是',
							success: (modalRes) => {
								if (modalRes.confirm) {
									console.log('用户选择继续批量上传');
									resolve(true);
								} else {
									console.log('用户选择不进行批量上传');
									resolve(false);
								}
							},
							fail: () => {
								console.log('弹窗失败，默认不上传');
								resolve(false);
							}
						});
					});
				}
			},

			// 删除单个记录
			async deleteItem(item) {
				if (!item.id) {
					uni.showToast({
						title: '记录ID无效',
						icon: 'none'
					});
					return;
				}

				uni.showModal({
					title: '确认删除',
					content: `确定要删除 ${item.userName || '未知用户'} 的测量记录吗？删除后无法恢复。`,
					cancelText: '取消',
					confirmText: '删除',
					success: async (res) => {
						if (res.confirm) {
							try {
								uni.showLoading({ title: '删除中...' });

								// 调用删除接口
								await deleteBatchResults([item.id]);

								uni.hideLoading();
								uni.showToast({
									title: '✅ 删除成功',
									icon: 'success',
									duration: 2000
								});

								// 刷新数据
								setTimeout(() => {
									this.search();
								}, 500);

							} catch (error) {
								uni.hideLoading();
								console.error('删除记录失败:', error);
								uni.showToast({
									title: '❌ ' + (error.data?.message || '删除失败'),
									icon: 'none',
									duration: 3000
								});
							}
						}
					}
				});
			},

			// 批量删除
			async batchDelete() {
				if (this.selectedItems.length === 0) {
					uni.showToast({
						title: '请选择要删除的记录',
						icon: 'none'
					});
					return;
				}

				uni.showModal({
					title: '确认批量删除',
					content: `确定要删除选中的 ${this.selectedItems.length} 条测量记录吗？删除后无法恢复。`,
					cancelText: '取消',
					confirmText: '删除',
					success: async (res) => {
						if (res.confirm) {
							this.deleting = true;
							uni.showLoading({ title: '批量删除中...' });

							try {
								// 提取选中记录的ID
								const ids = this.selectedItems.map(item => item.id).filter(id => id !== undefined);
								
								if (ids.length === 0) {
									throw new Error('选中的记录没有有效的ID');
								}

								// 调用批量删除API
								await deleteBatchResults(ids);
								
								uni.hideLoading();
								uni.showToast({
									title: `✅ 成功删除 ${ids.length} 条记录`,
									icon: 'success',
									duration: 3000
								});

								// 清空选中状态
								this.selectedItems = [];
								
								// 刷新数据
								setTimeout(() => {
									this.search();
								}, 500);
								
							} catch (error) {
								uni.hideLoading();
								console.error('批量删除失败:', error);
								uni.showToast({
									title: '❌ ' + (error.data?.message || '批量删除失败'),
									icon: 'none',
									duration: 3000
								});
							} finally {
								this.deleting = false;
							}
						}
					}
				});
			}
		}
	}
</script>

<style scoped>
	.page-container {
		min-height: 100vh;
		width: 100vw;
		background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
		padding: 16px;
		overflow-y: auto;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
	}

	/* 顶部区域 */
	.header-section {
		flex-shrink: 0;
		margin-bottom: 16px;
	}

	.page-title {
		margin-bottom: 16px;
	}

	.title-text {
		font-size: 24px;
		font-weight: 700;
		color: #1e40af;
		text-shadow: 0 2px 4px rgba(30, 64, 175, 0.1);
	}

	/* 顶部表单样式 */
	.form-section {
		display: flex;
		gap: 12px;
		margin-bottom: 16px;
		background: #ffffff;
		padding: 20px 16px;
		border-radius: 16px;
		box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
		flex-shrink: 0;
		box-sizing: border-box;
		pointer-events: auto;
		z-index: 1;
		min-height: 88px;
		flex-wrap: wrap;
	}

	.form-item {
		display: flex;
		flex-direction: column;
		gap: 10px;
		pointer-events: auto;
		min-height: 68px;
	}

	.input-item {
		flex: 1;
		min-width: 200px;
	}

	.button-group {
		display: flex;
		gap: 12px;
		flex: 0 0 auto;
		min-width: 200px;
		width: 100%;
		flex-basis: 100%;
	}

	.button-item {
		flex: 1;
	}

	.form-label {
		font-size: 15px;
		font-weight: 600;
		color: #374151;
		margin-bottom: 4px;
	}

	.form-input {
		padding: 16px 14px;
		border: 2px solid #e5e7eb;
		border-radius: 10px;
		font-size: 16px;
		transition: all 0.3s ease;
		background: #f9fafb;
		box-sizing: border-box;
		color: #374151;
		outline: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		user-select: text;
		-webkit-user-select: text;
		-moz-user-select: text;
		-ms-user-select: text;
		pointer-events: auto;
		height: 48px;
		line-height: 1.2;
		cursor: text;
		-webkit-tap-highlight-color: transparent;
		touch-action: manipulation;
		display: block;
		width: 100%;
	}

	.form-input:hover {
		border-color: #d1d5db;
		background: #ffffff;
	}

	.form-input:focus {
		border-color: #3b82f6;
		background: #ffffff;
		outline: none;
		box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
	}

	/* 日期时间输入框样式 */
	.date-input {
		font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
		color-scheme: light;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	}

	.date-input::-webkit-calendar-picker-indicator {
		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="%236B7280" d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z"/></svg>');
		cursor: pointer;
		opacity: 0.7;
		transition: opacity 0.2s ease;
		width: 20px;
		height: 20px;
		margin-left: 8px;
	}

	.date-input::-webkit-calendar-picker-indicator:hover {
		opacity: 1;
		background-color: rgba(59, 130, 246, 0.1);
		border-radius: 4px;
	}

	.date-input::-webkit-datetime-edit {
		padding: 0;
	}

	.date-input::-webkit-datetime-edit-fields-wrapper {
		padding: 0;
	}

	/* Picker样式 */
	.picker-input {
		display: flex;
		align-items: center;
		justify-content: space-between;
		cursor: pointer;
		user-select: none;
		min-height: 48px;
		box-sizing: border-box;
		border-radius: 10px;
		transition: all 0.3s ease;
	}

	.picker-input:hover {
		background: #f9fafb;
		border-color: #d1d5db;
	}

	.picker-input:active {
		background: #f3f4f6;
		transform: scale(0.98);
	}

	.date-text {
		flex: 1;
		color: #374151;
		font-size: 16px;
		line-height: 1.5;
	}

	.date-text.placeholder {
		color: #9ca3af;
		font-style: italic;
	}

	.picker-arrow {
		font-size: 16px;
		color: #6b7280;
		margin-left: 8px;
		transition: color 0.2s ease;
	}

	.picker-input:hover .picker-arrow {
		color: #3b82f6;
	}

	.search-btn, .reset-btn {
		width: 100%;
		height: 48px;
		border-radius: 12px;
		border: none;
		font-size: 15px;
		font-weight: 600;
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
		position: relative;
		overflow: hidden;
		margin-top: 27px;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		backdrop-filter: blur(10px);
		text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	}

	.search-btn {
		background: linear-gradient(135deg, #3b82f6 0%, #1e40af 50%, #1d4ed8 100%);
		color: #ffffff;
		box-shadow: 
			0 4px 15px rgba(59, 130, 246, 0.4),
			0 2px 8px rgba(59, 130, 246, 0.2),
			inset 0 1px 0 rgba(255, 255, 255, 0.2);
		border: 1px solid rgba(255, 255, 255, 0.1);
	}

	.search-btn::before {
		content: '';
		position: absolute;
		top: 0;
		left: -100%;
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
		transition: left 0.6s ease;
	}

	.search-btn::after {
		content: '';
		position: absolute;
		top: 50%;
		left: 50%;
		width: 0;
		height: 0;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		transition: width 0.3s ease, height 0.3s ease;
	}

	.search-btn:hover {
		transform: translateY(-2px);
		box-shadow: 
			0 8px 25px rgba(59, 130, 246, 0.5),
			0 4px 12px rgba(59, 130, 246, 0.3),
			inset 0 1px 0 rgba(255, 255, 255, 0.3);
		background: linear-gradient(135deg, #4f46e5 0%, #3730a3 50%, #312e81 100%);
	}

	.search-btn:hover::before {
		left: 100%;
	}

	.search-btn:hover::after {
		width: 100%;
		height: 100%;
		opacity: 0;
	}

	.search-btn:active {
		transform: translateY(0px);
		box-shadow: 
			0 4px 15px rgba(59, 130, 246, 0.4),
			inset 0 2px 4px rgba(0, 0, 0, 0.2);
	}

	/* 按钮图标动画 */
	.search-btn text, .reset-btn text {
		display: flex;
		align-items: center;
		gap: 6px;
		transition: all 0.3s ease;
	}

	.search-btn:hover text {
		transform: scale(1.05);
	}

	.reset-btn:hover text {
		transform: scale(1.05);
	}

	/* 按钮禁用状态 */
	.search-btn:disabled, .reset-btn:disabled {
		opacity: 0.6;
		cursor: not-allowed;
		transform: none !important;
		pointer-events: none;
	}

	.search-btn:disabled::before, .reset-btn:disabled::before {
		display: none;
	}

	.search-btn:disabled::after, .reset-btn:disabled::after {
		display: none;
	}

	/* 按钮加载状态 */
	.search-btn.loading, .reset-btn.loading {
		position: relative;
		pointer-events: none;
	}

	.search-btn.loading::before, .reset-btn.loading::before {
		content: '';
		position: absolute;
		width: 16px;
		height: 16px;
		border: 2px solid rgba(255, 255, 255, 0.3);
		border-top: 2px solid #ffffff;
		border-radius: 50%;
		animation: button-spin 1s linear infinite;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		z-index: 1;
	}

	.search-btn.loading text, .reset-btn.loading text {
		opacity: 0;
	}

	@keyframes button-spin {
		0% { transform: translate(-50%, -50%) rotate(0deg); }
		100% { transform: translate(-50%, -50%) rotate(360deg); }
	}

	/* 按钮聚焦状态 */
	.search-btn:focus, .reset-btn:focus {
		outline: none;
		box-shadow: 
			0 0 0 3px rgba(59, 130, 246, 0.3),
			0 4px 15px rgba(59, 130, 246, 0.4),
			0 2px 8px rgba(59, 130, 246, 0.2);
	}

	.reset-btn:focus {
		box-shadow: 
			0 0 0 3px rgba(245, 158, 11, 0.3),
			0 4px 15px rgba(245, 158, 11, 0.4),
			0 2px 8px rgba(245, 158, 11, 0.2);
	}

	.reset-btn {
		background: linear-gradient(135deg, #f59e0b 0%, #d97706 50%, #b45309 100%);
		color: #ffffff;
		box-shadow: 
			0 4px 15px rgba(245, 158, 11, 0.4),
			0 2px 8px rgba(245, 158, 11, 0.2),
			inset 0 1px 0 rgba(255, 255, 255, 0.2);
		border: 1px solid rgba(255, 255, 255, 0.1);
	}

	.reset-btn::before {
		content: '';
		position: absolute;
		top: 0;
		left: -100%;
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
		transition: left 0.6s ease;
	}

	.reset-btn::after {
		content: '';
		position: absolute;
		top: 50%;
		left: 50%;
		width: 0;
		height: 0;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		transition: width 0.3s ease, height 0.3s ease;
	}

	.reset-btn:hover {
		transform: translateY(-2px);
		box-shadow: 
			0 8px 25px rgba(245, 158, 11, 0.5),
			0 4px 12px rgba(245, 158, 11, 0.3),
			inset 0 1px 0 rgba(255, 255, 255, 0.3);
		background: linear-gradient(135deg, #f97316 0%, #ea580c 50%, #c2410c 100%);
	}

	.reset-btn:hover::before {
		left: 100%;
	}

	.reset-btn:hover::after {
		width: 100%;
		height: 100%;
		opacity: 0;
	}

	.reset-btn:active {
		transform: translateY(0px);
		box-shadow: 
			0 4px 15px rgba(245, 158, 11, 0.4),
			inset 0 2px 4px rgba(0, 0, 0, 0.2);
	}

	/* 主体内容区域 */
	.main-content {
		flex-shrink: 0;
	}

	/* 表格卡片 */
	.table-card {
		background: #ffffff;
		border-radius: 16px;
		padding: 24px;
		box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
		display: flex;
		flex-direction: column;
		border: 1px solid rgba(59, 130, 246, 0.1);
	}

	.card-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20px;
		padding-bottom: 16px;
		border-bottom: 2px solid #f1f5f9;
	}

	.card-title {
		font-size: 18px;
		font-weight: 700;
		color: #1e40af;
	}

	.header-actions {
		display: flex;
		align-items: center;
		gap: 12px;
	}

	.action-buttons {
		display: flex;
		align-items: center;
		gap: 8px;
	}

	.record-stats {
		display: flex;
		align-items: center;
		gap: 8px;
	}

	.stats-text {
		font-size: 14px;
		color: #64748b;
		background: #f1f5f9;
		padding: 6px 12px;
		border-radius: 20px;
	}

	.selected-stats {
		font-size: 14px;
		color: #3b82f6;
		font-weight: 600;
		background: #e0f2fe;
		padding: 6px 12px;
		border-radius: 20px;
	}

	.batch-upload-btn {
		padding: 8px 16px;
		border-radius: 12px;
		border: none;
		font-size: 14px;
		font-weight: 600;
		transition: all 0.3s ease;
		background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
		color: #ffffff;
		box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3);
	}

	.batch-upload-btn:active {
		transform: translateY(1px);
		box-shadow: 0 2px 10px rgba(59, 130, 246, 0.3);
	}

	.batch-upload-btn:disabled {
		background: #e5e7eb;
		color: #9ca3af;
		cursor: not-allowed;
	}

	/* 表格容器 */
	.table-container {
		border-radius: 12px;
		border: 1px solid #e2e8f0;
		height: 430px; /* 固定高度以启用滚动 */
		width: 100%;
		max-width: 100%;
		-webkit-overflow-scrolling: touch;
		position: relative;
		background: #ffffff;
	}

	/* 滚动条样式 */
	.table-container::-webkit-scrollbar {
		width: 6px;
		background: #f1f5f9;
	}

	.table-container::-webkit-scrollbar-thumb {
		background: #cbd5e1;
		border-radius: 3px;
	}

	.table-container::-webkit-scrollbar-thumb:hover {
		background: #94a3b8;
	}

	/* 表格样式优化 */
	.custom-table {
		border-radius: 12px;
		overflow: hidden;
		width: 100%;
		max-width: 100%;
		table-layout: fixed;
		touch-action: manipulation;
		-webkit-overflow-scrolling: touch;
		border-collapse: collapse;
		border-spacing: 0;
		min-width: 760px; /* 调整为适合平板的最小宽度 */
	}

	/* 表格单元格基础样式 */
	.custom-table uni-td,
	.custom-table uni-th {
		padding: 8px 4px;
		border-right: 1px solid #e5e7eb;
		vertical-align: middle;
		overflow: hidden;
		text-overflow: ellipsis;
		word-wrap: break-word;
		hyphens: auto;
	}

	.custom-table uni-td:last-child,
	.custom-table uni-th:last-child {
		border-right: none;
	}

	/* 表格头部样式 */
	.custom-table uni-th {
		font-weight: 700;
		font-size: 13px;
		color: #1e293b;
		background: linear-gradient(135deg, #e0f2fe 0%, #dbeafe 100%);
		text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
	}

	/* 表格数据单元格样式 */
	.custom-table uni-td {
		font-size: 12px;
		color: #374151;
		background: #ffffff;
		transition: background-color 0.2s ease;
	}

	/* 表格行边框样式 */
	.custom-table uni-tr {
		border-bottom: 1px solid #f1f5f9;
	}

	.custom-table uni-tr:last-child {
		border-bottom: none;
	}

	/* 表格行悬停效果 */
	.custom-table uni-tr:hover uni-td {
		background-color: #f8fafc;
	}

	/* 表格行触摸优化 */
	.table-row {
		touch-action: manipulation;
		-webkit-tap-highlight-color: transparent;
	}

	/* 触摸设备优化 */
	@media (hover: none) and (pointer: coarse) {
		.table-row:hover {
			background: none;
		}
		
		.table-row:active {
			background: #e0f2fe;
		}
		
		.custom-table uni-tr:hover uni-td {
			background-color: inherit;
		}
		
		.custom-table uni-tr:active uni-td {
			background-color: #e0f2fe;
		}
	}

	.table-header {
		background: linear-gradient(135deg, #e0f2fe 0%, #dbeafe 100%);
		position: sticky;
		top: 0;
		z-index: 10;
		border-bottom: 2px solid #3b82f6;
	}

	.table-row:nth-child(even) {
		background: #f8fafc;
	}

	.table-row:hover {
		background: #e0f2fe;
		transition: background-color 0.2s ease;
	}

	.table-row:active {
		background: #bae6fd;
	}

	/* 单元格样式 */
	.cell-text {
		font-size: 14px;
		color: #374151;
		font-weight: 500;
		word-break: break-all;
		word-wrap: break-word;
		white-space: normal;
		line-height: 1.4;
		text-align: center;
	}

	/* 条码号特殊样式 */
	.barcode-text {
		font-size: 12px;
		color: #374151;
		font-weight: 600;
		line-height: 1.3;
		word-break: break-all;
		word-wrap: break-word;
		white-space: normal;
		letter-spacing: 0.5px;
		font-family: 'Courier New', monospace;
		max-width: 100%;
		display: inline-block;
		text-align: center;
	}

	/* 复选框容器 */
	.checkbox-container {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 4px;
	}

	.pressure-cell {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 1px;
		padding: 2px;
	}

	.pressure-value {
		font-size: 14px;
		font-weight: 700;
		color: #1e293b;
		line-height: 1.2;
	}

	.pressure-unit {
		font-size: 9px;
		color: #64748b;
	}

	.pulse-cell {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 1px;
		padding: 2px;
	}

	.pulse-value {
		font-size: 14px;
		font-weight: 700;
		color: #dc2626;
		line-height: 1.2;
	}

	.pulse-unit {
		font-size: 9px;
		color: #64748b;
	}

	/* 血压状态颜色样式 */
	.pressure-value.high {
		color: #dc2626 !important;
		font-weight: 800;
		text-shadow: 0 1px 2px rgba(220, 38, 38, 0.2);
	}

	.pressure-value.low {
		color: #2563eb !important;
		font-weight: 800;
		text-shadow: 0 1px 2px rgba(37, 99, 235, 0.2);
	}

	.pressure-value.normal {
		color: #059669 !important;
		font-weight: 800;
		text-shadow: 0 1px 2px rgba(5, 150, 105, 0.2);
	}

	/* 血压结果列样式 */
	.blood-pressure-result {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 2px;
	}

	.result-text {
		font-size: 12px;
		font-weight: 700;
		padding: 4px 8px;
		border-radius: 8px;
		text-align: center;
		white-space: nowrap;
		line-height: 1.2;
	}

	.result-text.high {
		color: #dc2626;
		background: rgba(220, 38, 38, 0.1);
		border: 1px solid rgba(220, 38, 38, 0.2);
	}

	.result-text.low {
		color: #2563eb;
		background: rgba(37, 99, 235, 0.1);
		border: 1px solid rgba(37, 99, 235, 0.2);
	}

	.result-text.normal {
		color: #059669;
		background: rgba(5, 150, 105, 0.1);
		border: 1px solid rgba(5, 150, 105, 0.2);
	}

	/* 颜色说明区域样式 */
	.color-legend {
		background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
		border-radius: 12px;
		padding: 16px 20px;
		margin-bottom: 16px;
		border: 1px solid rgba(59, 130, 246, 0.1);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
	}

	.legend-title {
		margin-bottom: 12px;
	}

	.legend-text {
		font-size: 14px;
		font-weight: 600;
		color: #1e40af;
	}

	.legend-items {
		display: flex;
		gap: 20px;
		flex-wrap: wrap;
		align-items: center;
	}

	.legend-item {
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 6px 12px;
		background: rgba(255, 255, 255, 0.6);
		border-radius: 8px;
		border: 1px solid rgba(255, 255, 255, 0.3);
		backdrop-filter: blur(10px);
		transition: all 0.2s ease;
	}

	.legend-item:hover {
		background: rgba(255, 255, 255, 0.8);
		transform: translateY(-1px);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	}

	.legend-color {
		width: 12px;
		height: 12px;
		border-radius: 50%;
		flex-shrink: 0;
		border: 2px solid rgba(255, 255, 255, 0.8);
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	}

	.legend-color.high {
		background: #dc2626;
		box-shadow: 0 0 8px rgba(220, 38, 38, 0.4);
	}

	.legend-color.normal {
		background: #059669;
		box-shadow: 0 0 8px rgba(5, 150, 105, 0.4);
	}

	.legend-color.low {
		background: #2563eb;
		box-shadow: 0 0 8px rgba(37, 99, 235, 0.4);
	}

	.legend-label {
		font-size: 12px;
		color: #374151;
		font-weight: 500;
		white-space: nowrap;
	}

	.time-text {
		font-size: 11px;
		color: #64748b;
		word-break: break-all;
		word-wrap: break-word;
		white-space: normal;
		line-height: 1.3;
		text-align: center;
	}

	.device-text {
		font-size: 11px;
		color: #6b7280;
		word-break: break-all;
		word-wrap: break-word;
		white-space: normal;
		line-height: 1.3;
		text-align: center;
	}

	.upload-btn {
		padding: 4px 8px;
		border-radius: 6px;
		border: none;
		font-size: 11px;
		font-weight: 600;
		transition: all 0.3s ease;
		cursor: pointer;
		min-width: 60px;
		white-space: nowrap;
	}

	.upload-btn:not(:disabled) {
		background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
		color: #ffffff;
		box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
	}

	.upload-btn:not(:disabled):hover {
		transform: translateY(-1px);
		box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
		background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
	}

	.upload-btn:disabled {
		background: #e5e7eb;
		color: #9ca3af;
		cursor: not-allowed;
	}

	/* 加载更多区域 */
	.load-more-section {
		flex-shrink: 0;
		margin-top: 20px;
		padding: 16px;
		border-top: 1px solid #e2e8f0;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.loading-tip, .no-more-tip, .pull-tip {
		padding: 12px 24px;
		border-radius: 20px;
		background: #f1f5f9;
	}

	.loading-text {
		font-size: 14px;
		color: #3b82f6;
		font-weight: 500;
	}

	.no-more-text {
		font-size: 14px;
		color: #6b7280;
		font-weight: 500;
	}

	.pull-text {
		font-size: 14px;
		color: #9ca3af;
		font-weight: 500;
	}

	/* 上传状态样式 */
	.upload-status {
		padding: 4px 8px;
		border-radius: 6px;
		border: none;
		font-size: 11px;
		font-weight: 600;
		transition: all 0.3s ease;
		cursor: default;
		min-width: 60px;
		white-space: nowrap;
	}

	.upload-status.success {
		background: linear-gradient(135deg, #10b981 0%, #059669 100%);
		color: #ffffff;
		box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
	}

	.upload-status.failed {
		background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
		color: #ffffff;
		box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
	}

	/* 操作单元格样式 */
	.action-cell {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 4px;
		padding: 2px;
	}

	/* 删除按钮样式 */
	.delete-btn {
		padding: 4px 8px;
		border-radius: 6px;
		border: none;
		font-size: 11px;
		font-weight: 600;
		transition: all 0.3s ease;
		cursor: pointer;
		min-width: 60px;
		white-space: nowrap;
		background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
		color: #ffffff;
		box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
	}

	.delete-btn:hover {
		transform: translateY(-1px);
		box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4);
		background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
	}

	.delete-btn:active {
		transform: translateY(0px);
		box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
	}

	.delete-btn:disabled {
		background: #e5e7eb;
		color: #9ca3af;
		cursor: not-allowed;
		transform: none;
		box-shadow: none;
	}

	/* 批量删除按钮样式 */
	.batch-delete-btn {
		padding: 8px 16px;
		border-radius: 12px;
		border: none;
		font-size: 14px;
		font-weight: 600;
		transition: all 0.3s ease;
		background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
		color: #ffffff;
		box-shadow: 0 4px 15px rgba(239, 68, 68, 0.3);
		cursor: pointer;
		white-space: nowrap;
	}

	.batch-delete-btn:hover {
		transform: translateY(-2px);
		box-shadow: 0 6px 20px rgba(239, 68, 68, 0.4);
		background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
	}

	.batch-delete-btn:active {
		transform: translateY(0px);
		box-shadow: 0 2px 10px rgba(239, 68, 68, 0.3);
	}

	.batch-delete-btn:disabled {
		background: #e5e7eb;
		color: #9ca3af;
		cursor: not-allowed;
		transform: none;
		box-shadow: none;
	}


	/* 平板设备优化 */
	@media screen and (min-width: 768px) and (max-width: 1366px) {
		.page-container {
			padding: 14px;
		}
		
		.form-section {
			padding: 18px 14px;
			min-height: 80px;
			gap: 10px;
		}
		
		.input-item {
			min-width: 180px;
		}
		
		.button-group {
			min-width: 180px;
		}
		
		.table-card {
			padding: 20px;
		}
		
		.title-text {
			font-size: 22px;
		}
		
		.form-input {
			height: 44px;
			padding: 14px 12px;
		}
		
		.search-btn, .reset-btn {
			height: 44px;
			font-size: 14px;
			margin-top: 27px;
		}

		.search-btn:hover {
			transform: translateY(-1px);
		}

		.reset-btn:hover {
			transform: translateY(-1px);
		}

		.button-group {
			min-width: 180px;
		}

		.table-container {
			height: 450px;
		}

		.batch-upload-btn {
			padding: 6px 12px;
			font-size: 13px;
		}

		.checkbox-container {
			padding: 4px;
		}

		.upload-btn {
			padding: 3px 6px;
			font-size: 10px;
			min-width: 55px;
		}

		.upload-status {
			padding: 3px 6px;
			font-size: 10px;
			min-width: 55px;
		}

		.delete-btn {
			padding: 3px 6px;
			font-size: 10px;
			min-width: 55px;
		}

		.batch-delete-btn {
			padding: 6px 12px;
			font-size: 13px;
		}

		.action-cell {
			gap: 3px;
		}

		.custom-table uni-td,
		.custom-table uni-th {
			padding: 6px 3px;
		}

		.barcode-text {
			font-size: 11px;
		}

		.pressure-value, .pulse-value {
			font-size: 13px;
		}

		.pressure-unit, .pulse-unit {
			font-size: 8px;
		}

		.time-text, .device-text {
			font-size: 10px;
		}

		.custom-table uni-th {
			font-size: 12px;
		}

		.custom-table {
			min-width: 720px;
		}

		.table-container::-webkit-scrollbar {
			width: 8px;
		}

		.date-input::-webkit-calendar-picker-indicator {
			width: 18px;
			height: 18px;
		}

		.picker-input {
			min-height: 44px;
		}

		.date-text {
			font-size: 14px;
		}

		.picker-arrow {
			font-size: 14px;
		}
	}

	/* 小屏幕适配 */
	@media (max-width: 767px) {
		.page-container {
			padding: 16px;
		}

		.form-section {
			flex-direction: column;
			gap: 12px;
			padding: 16px;
			min-height: auto;
		}

		.input-item {
			flex: 1;
			min-width: auto;
		}

		.button-group {
			flex-direction: row;
			min-width: auto;
			margin-top: 8px;
			width: 100%;
			flex-basis: auto;
		}

		.form-item {
			min-height: auto;
		}

		.search-btn, .reset-btn {
			margin-top: 0;
			height: 42px;
			font-size: 14px;
		}

		.search-btn:hover {
			transform: translateY(-1px);
		}

		.reset-btn:hover {
			transform: translateY(-1px);
		}

		.table-card {
			padding: 16px;
		}

		.title-text {
			font-size: 20px;
		}

		.form-input {
			height: 42px;
			padding: 12px 10px;
			font-size: 15px;
		}

		.table-container {
			height: 380px;
		}

		.batch-upload-btn {
			padding: 6px 10px;
			font-size: 12px;
		}

		.checkbox-container {
			padding: 2px;
		}

		.upload-btn {
			padding: 2px 4px;
			font-size: 9px;
			min-width: 50px;
		}

		.upload-status {
			padding: 2px 4px;
			font-size: 9px;
			min-width: 50px;
		}

		.delete-btn {
			padding: 2px 4px;
			font-size: 9px;
			min-width: 50px;
		}

		.batch-delete-btn {
			padding: 6px 10px;
			font-size: 12px;
		}

		.action-cell {
			gap: 2px;
		}

		.custom-table uni-td,
		.custom-table uni-th {
			padding: 4px 2px;
		}

		.barcode-text {
			font-size: 10px;
		}

		.pressure-value, .pulse-value {
			font-size: 12px;
		}

		.pressure-unit, .pulse-unit {
			font-size: 7px;
		}

		.time-text, .device-text {
			font-size: 9px;
		}

		.cell-text {
			font-size: 12px;
		}

		.custom-table uni-th {
			font-size: 11px;
		}

		.custom-table {
			min-width: 680px;
		}

		.table-container::-webkit-scrollbar {
			width: 4px;
		}

		.date-input::-webkit-calendar-picker-indicator {
			width: 16px;
			height: 16px;
			margin-left: 4px;
		}

		.picker-input {
			min-height: 42px;
		}

		.date-text {
			font-size: 14px;
		}

		.picker-arrow {
			font-size: 14px;
			margin-left: 6px;
		}

		.header-actions {
			flex-direction: column;
			gap: 8px;
		}

		.record-stats {
			flex-direction: column;
			gap: 4px;
		}
	}

	/* AI智能上传按钮样式 */
	.ai-upload-btn {
		padding: 8px 16px;
		border-radius: 12px;
		border: none;
		font-size: 14px;
		font-weight: 600;
		transition: all 0.3s ease;
		background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
		color: #ffffff;
		box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
		cursor: pointer;
		white-space: nowrap;
	}

	.ai-upload-btn:hover {
		transform: translateY(-2px);
		box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4);
		background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
	}

	.ai-upload-btn:active {
		transform: translateY(0px);
		box-shadow: 0 2px 10px rgba(139, 92, 246, 0.3);
	}

	.ai-upload-btn:disabled {
		background: #e5e7eb;
		color: #9ca3af;
		cursor: not-allowed;
		transform: none;
		box-shadow: none;
	}

	/* AI弹窗样式 */
	.ai-modal-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.5);
		backdrop-filter: blur(4px);
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 90;
		padding: 20px;
		box-sizing: border-box;
	}

	.ai-modal-container {
		background: #ffffff;
		border-radius: 20px;
		box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
		width: 100%;
		max-width: 600px;
		max-height: 80vh;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		transform: scale(1);
		animation: modalShow 0.3s ease-out;
	}

	@keyframes modalShow {
		from {
			opacity: 0;
			transform: scale(0.9) translateY(-20px);
		}
		to {
			opacity: 1;
			transform: scale(1) translateY(0);
		}
	}

	.ai-modal-header {
		padding: 20px 24px;
		border-bottom: 1px solid #e5e7eb;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
	}

	.ai-modal-title {
		font-size: 18px;
		font-weight: 700;
		color: #1e293b;
		display: flex;
		align-items: center;
		gap: 8px;
	}

	.close-btn {
		width: 32px;
		height: 32px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		transition: all 0.2s ease;
		color: #64748b;
		font-size: 18px;
		font-weight: 600;
		background: #f1f5f9;
	}

	.close-btn:hover {
		background: #e2e8f0;
		color: #374151;
		transform: scale(1.1);
	}

	.ai-modal-content {
		flex: 1;
		padding: 20px 24px;
		overflow: hidden;
		display: flex;
		flex-direction: column;
	}

	.ai-result-info {
		margin-bottom: 16px;
		padding: 12px 16px;
		background: linear-gradient(135deg, #e0f2fe 0%, #dbeafe 100%);
		border-radius: 12px;
		border-left: 4px solid #3b82f6;
	}

	.result-count {
		font-size: 16px;
		font-weight: 600;
		color: #1e40af;
	}

	.ai-results-list {
		flex: 1;
		max-height: 300px;
		overflow-y: auto;
		border: 1px solid #e5e7eb;
		border-radius: 12px;
		padding: 8px;
		background: #f9fafb;
	}

	.ai-result-item {
		background: #ffffff;
		border-radius: 12px;
		padding: 16px;
		margin-bottom: 12px;
		border: 1px solid #e5e7eb;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
		transition: all 0.2s ease;
	}

	.ai-result-item:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
		border-color: #3b82f6;
	}

	.ai-result-item:last-child {
		margin-bottom: 0;
	}

	.result-header {
		display: flex;
		align-items: center;
		gap: 12px;
		margin-bottom: 12px;
		padding-bottom: 8px;
		border-bottom: 1px solid #f1f5f9;
	}

	.result-index {
		font-size: 14px;
		font-weight: 700;
		color: #8b5cf6;
		min-width: 20px;
	}

	.result-name {
		font-size: 16px;
		font-weight: 600;
		color: #1e293b;
		flex: 1;
	}

	.result-barcode {
		font-size: 12px;
		color: #64748b;
		background: #f1f5f9;
		padding: 4px 8px;
		border-radius: 6px;
		font-family: monospace;
	}

	.result-data {
		display: flex;
		gap: 16px;
		margin-bottom: 8px;
		flex-wrap: wrap;
	}

	.data-group {
		display: flex;
		align-items: center;
		gap: 4px;
	}

	.data-label {
		font-size: 13px;
		color: #64748b;
		font-weight: 500;
	}

	.data-value {
		font-size: 14px;
		color: #1e293b;
		font-weight: 600;
	}

	.result-time {
		text-align: right;
	}

	.time-text {
		font-size: 12px;
		color: #9ca3af;
		font-style: italic;
	}

	.ai-modal-footer {
		padding: 20px 24px;
		border-top: 1px solid #e5e7eb;
		display: flex;
		justify-content: flex-end;
		gap: 12px;
		background: #f9fafb;
	}

	.cancel-btn, .confirm-btn {
		padding: 10px 20px;
		border-radius: 8px;
		border: none;
		font-size: 14px;
		font-weight: 600;
		cursor: pointer;
		transition: all 0.2s ease;
		min-width: 80px;
		flex: 1;
	}

	.cancel-btn {
		background: #f1f5f9;
		color: #64748b;
		border: 1px solid #e2e8f0;
	}

	.cancel-btn:hover {
		background: #e2e8f0;
		color: #475569;
	}

	.confirm-btn {
		background: linear-gradient(135deg, #10b981 0%, #059669 100%);
		color: #ffffff;
		box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
	}

	.confirm-btn:hover {
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(16, 185, 129, 0.4);
		background: linear-gradient(135deg, #059669 0%, #047857 100%);
	}

	.confirm-btn:active {
		transform: translateY(0px);
		box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
	}

	.confirm-btn:disabled {
		background: #e5e7eb;
		color: #9ca3af;
		cursor: not-allowed;
		transform: none;
		box-shadow: none;
	}

	/* 平板设备优化 */
	@media screen and (min-width: 768px) and (max-width: 1366px) {
		.ai-upload-btn {
			padding: 6px 12px;
			font-size: 13px;
		}

		.ai-modal-container {
			max-width: 500px;
		}

		.ai-modal-header {
			padding: 16px 20px;
		}

		.ai-modal-title {
			font-size: 16px;
		}

		.ai-modal-content {
			padding: 16px 20px;
		}

		.ai-result-item {
			padding: 12px;
		}

		.result-name {
			font-size: 15px;
		}

		.data-value {
			font-size: 13px;
		}

		.ai-modal-footer {
			padding: 16px 20px;
		}

		/* 血压结果列 - 平板优化 */
		.result-text {
			font-size: 11px;
			padding: 3px 6px;
		}

		/* 颜色说明 - 平板优化 */
		.color-legend {
			padding: 14px 16px;
			margin-bottom: 14px;
		}

		.legend-text {
			font-size: 13px;
		}

		.legend-items {
			gap: 16px;
		}

		.legend-item {
			padding: 5px 10px;
		}

		.legend-color {
			width: 10px;
			height: 10px;
		}

		.legend-label {
			font-size: 11px;
		}

		.custom-table {
			min-width: 800px;
		}
	}

	/* 小屏幕适配 */
	@media (max-width: 767px) {
		.action-buttons {
			flex-direction: column;
			gap: 6px;
		}

		.ai-upload-btn {
			padding: 6px 10px;
			font-size: 12px;
		}

		.ai-modal-overlay {
			padding: 10px;
		}

		.ai-modal-container {
			max-width: 100%;
			max-height: 90vh;
		}

		.ai-modal-header {
			padding: 14px 16px;
		}

		.ai-modal-title {
			font-size: 16px;
		}

		.ai-modal-content {
			padding: 14px 16px;
		}

		.ai-results-list {
			max-height: 250px;
		}

		.ai-result-item {
			padding: 12px;
		}

		.result-header {
			flex-direction: column;
			align-items: flex-start;
			gap: 6px;
		}

		.result-name {
			font-size: 14px;
		}

		.result-data {
			flex-direction: column;
			gap: 8px;
		}

		.data-value {
			font-size: 13px;
		}

		.ai-modal-footer {
			padding: 14px 16px;
			flex-direction: column;
		}

		.cancel-btn, .confirm-btn {
			width: 100%;
			padding: 12px;
		}

		/* 血压结果列 - 小屏幕优化 */
		.result-text {
			font-size: 10px;
			padding: 2px 4px;
		}

		/* 颜色说明 - 小屏幕优化 */
		.color-legend {
			padding: 12px 14px;
			margin-bottom: 12px;
		}

		.legend-text {
			font-size: 12px;
		}

		.legend-items {
			gap: 12px;
			flex-direction: column;
		}

		.legend-item {
			padding: 4px 8px;
			justify-content: flex-start;
		}

		.legend-color {
			width: 8px;
			height: 8px;
		}

		.legend-label {
			font-size: 10px;
		}

		.custom-table {
			min-width: 720px;
		}
	}
</style>